<script lang="ts" setup>
  import { pwa } from '@/config'
  import { enLocale, zhLocale } from '@/i18n/index'
  const { locale: language } = useI18n()

  const locale = computed(() => (language.value === 'en' ? enLocale : zhLocale))

  const VabUpdate = defineAsyncComponent(
    () => import('@/plugins/VabUpdate/index.vue')
  )
</script>
<template>
  <el-config-provider
    :button="{
      autoInsertSpace: true,
    }"
    :locale="locale"
  >
    <router-view v-slot="{ Component }">
      <component :is="Component" />
    </router-view>
    <vab-update v-if="pwa" ref="vabUpdateRef" />
  </el-config-provider>
</template>
<style>
  /* 谷歌 */
  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin: 0;
  }
  /* 火狐 */
  input[type='number'] {
    -moz-appearance: textfield;
  }
  .input_w {
    width: 214px !important;
  }
  .pro_title {
    margin-bottom: 16px;
    margin-left: 26px;
    font-size: 15px;
    font-weight: bold;
  }
  .pro_content {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
  }

  .file_pot {
    width: 100%;
    height: 92px;
  }
  .upload-image {
    display: flex;
    align-content: center;
    justify-content: center;
  }
</style>
<style lang="scss" scoped>
  :deep() {
    .el-input__wrapper {
      width: 100%;
    }
    .but_text {
      padding: 2px 0px;
    }
    .upload_show {
      .el-upload {
        display: flex !important;
        width: 80px;
        height: 80px;
        border-radius: 6px;
        border: 1px dashed #c0ccda;

        .ri-add-line {
          font-size: 24px;
          color: #8c939d;
        }
      }
    }
    .upload_hide {
      .el-upload {
        display: none !important;
      }
    }
    .upload-content {
      .el-upload__tip {
        display: block;
        height: 30px;
        line-height: 30px;
      }
      .el-icon--document {
        display: none;
      }
      .el-upload-list__item {
        margin-top: -10px;
      }
      .el-upload-list__item-info {
        cursor: pointer;
      }
      .el-upload-list--picture-card {
        .el-upload-list__item {
          width: 80px;
          height: 80px;
        }
      }
    }
  }
</style>
